<?php @session_start();?>
<?php
require_once('./safe.php');
require_once('../admin/config.php');
$conn = mysql_connect($cfg_dbhost,$cfg_dbuser,$cfg_dbpwd);
mysql_select_db($cfg_dbname,$conn);
$sql="select * from ph_user where user_name='".$_SESSION["username"]."'";
$result=mysql_query($sql);
$row=mysql_fetch_array($result);
$sqltdk="select * from ph_tdk where 1=1";
$resulttdk=mysql_query($sqltdk);
$rowtdk=mysql_fetch_array($resulttdk);
?>
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

                    <link rel="apple-touch-icon" sizes="180x180" href="https://iosinstalls.com/images/iosinstalls/favicon/apple-touch-icon.png">

            <meta name="theme-color" content="#ffffff">
        

        <title><?php echo $rowtdk["sitename"];?> - Dashboard</title>

        <link href="../css/customer-iosinstalls.css?id=a9a9c5930bcdb195e9ee" rel="stylesheet">
        <link rel="stylesheet" type="text/css" href="<?php if(!empty($rowtdk["fontlink"])){echo '//fonts.googleapis.com/css?family='.$rowtdk["fontlink"];}else{echo "//fonts.googleapis.com/css?family=Roboto:300,400,500";}?>">
        <style type="text/css">
            body{font-family: '<?php echo $rowtdk["fontlink"];?>';}
        </style>
                                    
        <script type="module" src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v2.x.x/dist/alpine.min.js"></script>
        <script nomodule src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v2.x.x/dist/alpine-ie11.min.js" defer></script>
    </head>

    <body class="app header-fixed sidebar-fixed aside-menu-fixed aside-menu-hidden">

    <?php include("head.php");?> 
    <?php include("left.php");?>

            <!-- Main content -->
            <main class="main">
                    <div class="container-fluid padding-top" x-data="main()" x-init="init()">
        <div class="row">
            <div class="col-md-12 mb-3">
                <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#addKeywordModal" disabled="disabled" id="openKeywordModal">
                    Add Keyword
                </button>
            </div>

            <div class="col-md-12">
                <div class="card">
                    <div class="card-header bg-primary">
                        <b>Keywords</b>
                    </div>
                    <div class="card-body">
                        <div class="alert alert-info">
                            You can update each Keyword rank once every hour.
                        </div>

                        <div class="form-group">
                            <label>App</label>
                            <select id="app" name="app" class="selectpicker" autocomplete="off" data-size="7" data-width="100%" title="Select app" x-bind:disabled="appLocked">
                                <template x-for="item in apps">
                                    <option x-bind:value="item.id" x-bind:data-content="getAppDataContent(item)" x-bind:data-app-store="item.app_store.internal_name"></option>
                                </template>
                            </select>
                        </div>

                        <div class="form-group">
                            <label>Country</label>
                            <select id="country_id" name="country_id" class="selectpicker" autocomplete="off" data-width="100%" title="Select country" disabled="disabled">
                                                                                        <option value="4" data-app-store="app_store" class="hidden" >Algeria</option>
                                                            <option value="7" data-app-store="app_store" class="hidden" >Angola</option>
                                                            <option value="8" data-app-store="app_store" class="hidden" >Anguilla</option>
                                                            <option value="11" data-app-store="app_store" class="hidden" >Argentina</option>
                                                            <option value="12" data-app-store="app_store" class="hidden" >Armenia</option>
                                                            <option value="14" data-app-store="app_store" class="hidden" >Australia</option>
                                                            <option value="15" data-app-store="app_store" class="hidden" >Austria</option>
                                                            <option value="16" data-app-store="app_store" class="hidden" >Azerbaijan</option>
                                                            <option value="18" data-app-store="app_store" class="hidden" >Bahrain</option>
                                                            <option value="20" data-app-store="app_store" class="hidden" >Barbados</option>
                                                            <option value="21" data-app-store="app_store" class="hidden" >Belarus</option>
                                                            <option value="22" data-app-store="app_store" class="hidden" >Belgium</option>
                                                            <option value="23" data-app-store="app_store" class="hidden" >Belize</option>
                                                            <option value="25" data-app-store="app_store" class="hidden" >Bermuda</option>
                                                            <option value="27" data-app-store="app_store" class="hidden" >Bolivia</option>
                                                            <option value="29" data-app-store="app_store" class="hidden" >Botswana</option>
                                                            <option value="31" data-app-store="app_store" class="hidden" >Brazil</option>
                                                            <option value="33" data-app-store="app_store" class="hidden" >British Virgin Islands</option>
                                                            <option value="34" data-app-store="app_store" class="hidden" >Brunei Darussalam</option>
                                                            <option value="35" data-app-store="app_store" class="hidden" >Bulgaria</option>
                                                            <option value="40" data-app-store="app_store" class="hidden" >Canada</option>
                                                            <option value="42" data-app-store="app_store" class="hidden" >Cayman Islands</option>
                                                            <option value="45" data-app-store="app_store" class="hidden" >Chile</option>
                                                            <option value="46" data-app-store="app_store" class="hidden" >China</option>
                                                            <option value="49" data-app-store="app_store" class="hidden" >Colombia</option>
                                                            <option value="53" data-app-store="app_store" class="hidden" >Costa Rica</option>
                                                            <option value="54" data-app-store="app_store" class="hidden" >Croatia</option>
                                                            <option value="57" data-app-store="app_store" class="hidden" >Cyprus</option>
                                                            <option value="58" data-app-store="app_store" class="hidden" >Czech Republic</option>
                                                            <option value="60" data-app-store="app_store" class="hidden" >Denmark</option>
                                                            <option value="62" data-app-store="app_store" class="hidden" >Dominica</option>
                                                            <option value="65" data-app-store="app_store" class="hidden" >Ecuador</option>
                                                            <option value="66" data-app-store="app_store" class="hidden" >Egypt</option>
                                                            <option value="67" data-app-store="app_store" class="hidden" >El Salvador</option>
                                                            <option value="70" data-app-store="app_store" class="hidden" >Estonia</option>
                                                            <option value="75" data-app-store="app_store" class="hidden" >Finland</option>
                                                            <option value="76" data-app-store="app_store" class="hidden" >France</option>
                                                            <option value="83" data-app-store="app_store" class="hidden" >Germany</option>
                                                            <option value="84" data-app-store="app_store" class="hidden" >Ghana</option>
                                                            <option value="86" data-app-store="app_store" class="hidden" >Greece</option>
                                                            <option value="88" data-app-store="app_store" class="hidden" >Grenada</option>
                                                            <option value="91" data-app-store="app_store" class="hidden" >Guatemala</option>
                                                            <option value="95" data-app-store="app_store" class="hidden" >Guyana</option>
                                                            <option value="98" data-app-store="app_store" class="hidden" >Honduras</option>
                                                            <option value="99" data-app-store="app_store" class="hidden" >Hong Kong</option>
                                                            <option value="100" data-app-store="app_store" class="hidden" >Hungary</option>
                                                            <option value="101" data-app-store="app_store" class="hidden" >Iceland</option>
                                                            <option value="102" data-app-store="app_store" class="hidden" >India</option>
                                                            <option value="103" data-app-store="app_store" class="hidden" >Indonesia</option>
                                                            <option value="106" data-app-store="app_store" class="hidden" >Ireland</option>
                                                            <option value="108" data-app-store="app_store" class="hidden" >Israel</option>
                                                            <option value="109" data-app-store="app_store" class="hidden" >Italy</option>
                                                            <option value="111" data-app-store="app_store" class="hidden" >Jamaica</option>
                                                            <option value="112" data-app-store="app_store" class="hidden" >Japan</option>
                                                            <option value="114" data-app-store="app_store" class="hidden" >Jordan</option>
                                                            <option value="116" data-app-store="app_store" class="hidden" >Kenya</option>
                                                            <option value="118" data-app-store="app_store" class="hidden" >Kuwait</option>
                                                            <option value="121" data-app-store="app_store" class="hidden" >Latvia</option>
                                                            <option value="122" data-app-store="app_store" class="hidden" >Lebanon</option>
                                                            <option value="127" data-app-store="app_store" class="hidden" >Lithuania</option>
                                                            <option value="128" data-app-store="app_store" class="hidden" >Luxembourg</option>
                                                            <option value="129" data-app-store="app_store" class="hidden" >Macau</option>
                                                            <option value="130" data-app-store="app_store" class="hidden" >Macedonia</option>
                                                            <option value="131" data-app-store="app_store" class="hidden" >Madagascar</option>
                                                            <option value="133" data-app-store="app_store" class="hidden" >Malaysia</option>
                                                            <option value="135" data-app-store="app_store" class="hidden" >Mali</option>
                                                            <option value="136" data-app-store="app_store" class="hidden" >Malta</option>
                                                            <option value="140" data-app-store="app_store" class="hidden" >Mauritius</option>
                                                            <option value="142" data-app-store="app_store" class="hidden" >Mexico</option>
                                                            <option value="148" data-app-store="app_store" class="hidden" >Montserrat</option>
                                                            <option value="154" data-app-store="app_store" class="hidden" >Nepal</option>
                                                            <option value="155" data-app-store="app_store" class="hidden" >Netherlands</option>
                                                            <option value="157" data-app-store="app_store" class="hidden" >New Zealand</option>
                                                            <option value="158" data-app-store="app_store" class="hidden" >Nicaragua</option>
                                                            <option value="159" data-app-store="app_store" class="hidden" >Niger</option>
                                                            <option value="160" data-app-store="app_store" class="hidden" >Nigeria</option>
                                                            <option value="165" data-app-store="app_store" class="hidden" >Norway</option>
                                                            <option value="166" data-app-store="app_store" class="hidden" >Oman</option>
                                                            <option value="167" data-app-store="app_store" class="hidden" >Pakistan</option>
                                                            <option value="170" data-app-store="app_store" class="hidden" >Panama</option>
                                                            <option value="172" data-app-store="app_store" class="hidden" >Paraguay</option>
                                                            <option value="173" data-app-store="app_store" class="hidden" >Peru</option>
                                                            <option value="174" data-app-store="app_store" class="hidden" >Philippines</option>
                                                            <option value="176" data-app-store="app_store" class="hidden" >Poland</option>
                                                            <option value="177" data-app-store="app_store" class="hidden" >Portugal</option>
                                                            <option value="179" data-app-store="app_store" class="hidden" >Qatar</option>
                                                            <option value="181" data-app-store="app_store" class="hidden" >Romania</option>
                                                            <option value="182" data-app-store="app_store" class="hidden" >Russian Federation</option>
                                                            <option value="188" data-app-store="app_store" class="hidden" >Saudi Arabia</option>
                                                            <option value="189" data-app-store="app_store" class="hidden" >Senegal</option>
                                                            <option value="194" data-app-store="app_store" class="hidden" >Singapore</option>
                                                            <option value="195" data-app-store="app_store" class="hidden" >Slovakia</option>
                                                            <option value="196" data-app-store="app_store" class="hidden" >Slovenia</option>
                                                            <option value="199" data-app-store="app_store" class="hidden" >South Africa</option>
                                                            <option value="203" data-app-store="app_store" class="hidden" >Spain</option>
                                                            <option value="204" data-app-store="app_store" class="hidden" >Sri Lanka</option>
                                                            <option value="212" data-app-store="app_store" class="hidden" >Suriname</option>
                                                            <option value="215" data-app-store="app_store" class="hidden" >Sweden</option>
                                                            <option value="216" data-app-store="app_store" class="hidden" >Switzerland</option>
                                                            <option value="218" data-app-store="app_store" class="hidden" >Taiwan</option>
                                                            <option value="220" data-app-store="app_store" class="hidden" >Tanzania</option>
                                                            <option value="221" data-app-store="app_store" class="hidden" >Thailand</option>
                                                            <option value="226" data-app-store="app_store" class="hidden" >Tunisia</option>
                                                            <option value="227" data-app-store="app_store" class="hidden" >Turkey</option>
                                                            <option value="231" data-app-store="app_store" class="hidden" >Uganda</option>
                                                            <option value="232" data-app-store="app_store" class="hidden" >Ukraine</option>
                                                            <option value="233" data-app-store="app_store" class="hidden" >United Arab Emirates</option>
                                                            <option value="234" data-app-store="app_store" class="hidden" >United Kingdom</option>
                                                            <option value="235" data-app-store="app_store" class="hidden" selected=&quot;selected&quot;>United States</option>
                                                            <option value="236" data-app-store="app_store" class="hidden" >Uruguay</option>
                                                            <option value="239" data-app-store="app_store" class="hidden" >Uzbekistan</option>
                                                            <option value="242" data-app-store="app_store" class="hidden" >Venezuela</option>
                                                            <option value="243" data-app-store="app_store" class="hidden" >Vietnam</option>
                                                            <option value="246" data-app-store="app_store" class="hidden" >Yemen</option>
                                                        </select>
                        </div>

                        <div class="form-group hidden" id="languageForm">
                            <label>Search language</label>
                            <select id="languageId" name="language_id" class="selectpicker" autocomplete="off" data-width="100%" title="Select language">
                                                                    <option value="1" >Afrikaans</option>
                                                                    <option value="2" >Amharic</option>
                                                                    <option value="3" >Bulgarian</option>
                                                                    <option value="4" >Catalan</option>
                                                                    <option value="5" >Chinese (Hong Kong)</option>
                                                                    <option value="6" >Chinese (PRC)</option>
                                                                    <option value="7" >Chinese (Taiwan)</option>
                                                                    <option value="8" >Croatian</option>
                                                                    <option value="9" >Czech</option>
                                                                    <option value="10" >Danish</option>
                                                                    <option value="11" >Dutch</option>
                                                                    <option value="12" selected="selected">English</option>
                                                                    <option value="13" >Estonian</option>
                                                                    <option value="14" >Filipino</option>
                                                                    <option value="15" >Finnish</option>
                                                                    <option value="16" >French</option>
                                                                    <option value="17" >German</option>
                                                                    <option value="18" >Greek</option>
                                                                    <option value="19" >Hebrew</option>
                                                                    <option value="20" >Hindi</option>
                                                                    <option value="21" >Hungarian</option>
                                                                    <option value="22" >Icelandic</option>
                                                                    <option value="23" >Indonesian</option>
                                                                    <option value="24" >Italian</option>
                                                                    <option value="25" >Japanese</option>
                                                                    <option value="26" >Korean</option>
                                                                    <option value="27" >Latvian</option>
                                                                    <option value="28" >Lithuanian</option>
                                                                    <option value="29" >Malay</option>
                                                                    <option value="30" >Norwegian</option>
                                                                    <option value="31" >Polish</option>
                                                                    <option value="32" >Portuguese (Brazil)</option>
                                                                    <option value="33" >Portuguese (Portugal)</option>
                                                                    <option value="34" >Romanian</option>
                                                                    <option value="35" >Russian</option>
                                                                    <option value="36" >Serbian</option>
                                                                    <option value="37" >Slovak</option>
                                                                    <option value="38" >Slovenian</option>
                                                                    <option value="39" >Spanish</option>
                                                                    <option value="40" >Swahili</option>
                                                                    <option value="41" >Swedish</option>
                                                                    <option value="42" >Thai</option>
                                                                    <option value="43" >Turkish</option>
                                                                    <option value="44" >Ukrainian</option>
                                                                    <option value="45" >Vietnamese</option>
                                                                    <option value="46" >Zulu</option>
                                                            </select>
                        </div>

                        <div class="table-responsive mt-4 hidden" id="keywordsContainer">
                            <table class="table table-hover mb-0" id="keywords">
                                <thead class="thead-default">
                                <tr>
                                    <th>Keyword</th>
                                    <th>Current rank</th>
                                    <th></th>
                                </tr>
                                </thead>
                                <tbody id="keywords">
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="row hidden" id="keywordStatistics">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-header bg-primary">
                        <b>Keyword Ranks (Last 30 days)</b>
                    </div>
                    <div class="card-body">
                        <canvas id="stats"></canvas>
                    </div>
                </div>
            </div>
        </div>

        <div class="modal fade" id="addKeywordModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <form id="addKeywordForm">
                        <div class="modal-header">
                            <h5 class="modal-title" id="exampleModalLabel">Add Keyword</h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                        <div class="modal-body">
                            <div class="alert alert-success hidden">
                                The Keywords is now added
                            </div>
                            <fieldset class="form-group">
                                <label>Keyword name</label>
                                <input type="text" class="form-control" id="keyword" name="keyword" autocomplete="off" autofocus>
                                <small>Use comma or press enter to add multiple keywords at once</small>
                            </fieldset>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                            <button type="submit" class="btn btn-primary ladda-button">Add Keywords</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

            </main>
        </div>

        <footer class="app-footer">
                            &copy; 2021 <?php echo $rowtdk["sitename"];?>. All Rights Reserved
                        <div class="pull-right">
                Server time: <?php echo date('d-m-Y H:i:s',time());?>
            </div>
        </footer>

        <!-- Bootstrap and necessary plugins -->
        <script src="/js/backend.js?id=27298b157affa1f728a9"></script>

        
        <script type="text/javascript">
        function main() {
            return {
                loading: false,
                appLocked: true,
                apps: [],
                init() {
                    axios.get('/dashboard/apps.php')
                        .then((response) => {
                            this.apps = response.data

                            this.setAppLocked(false)
                        })
                },
                getAppDataContent(app) {
                    return '<img src="/images/stores/' + app.app_store.icon + '" height="20px" style="margin-right: 20px" /><img src="' + app.icon + '" height="40px" style="margin-right: 10px" />' + app.name
                },
                setAppLocked(newVal) {
                    this.appLocked = newVal
                    this.$nextTick(() => {
                        $('.selectpicker').selectpicker('refresh')
                    })
                },
            }
        }
    </script>

    <script type="text/javascript">
        function fetchKeywords() {
            let appId = $('#app').val();

            if (!appId) {
                return;
            }

            $('#keywords tr').remove();

            let params = {
                app_id: appId,
                country_id: $('#country_id').val(),
                ranks: true
            };

            if ($('#app option:selected').data('app-store') === 'google_play') {
                params.language_id = $('#languageId').val()
            }

            axios.post('/dashboard/get-keywords.php', params).then(response => {
                response.data.forEach(keyword => {
                    $('#keywords').append(
                        '<tr>\n' +
                        '\t<td>' + keyword.name + '</td>\n' +
                        //'\t<td><span class="rank">' + (keyword.latest_rank ? keyword.latest_rank : '') + '</span> <i class="fa fa-redo cursor-pointer update-rank" data-keyword-id="' + keyword.id + '"></i></td>\n' +
                        '\t<td>\n' +
                        //'\t\t<button class="btn btn-primary statictics ml-2 text-white" title="Statistics" data-keyword-id="' + keyword.id + '"><i class="fa fa-chart-bar"></i></button>\n' +
                        '\t\t<button class="btn btn-danger delete" title="Delete" data-keyword-id="' + keyword.id + '"><i class="fa fa-times"></i></button>\n' +
                        '\t</td>\n' +
                        '</tr>'
                    )
                })

                $('#keywordsContainer').removeClass('hidden')

                if (response.data.length > 0) {
                    fetchKeywordStats(response.data[0].id)
                    assignUpdateRankEvent()
                    assignStatisticsEvent()
                    assignDeleteEvent()
                }
            })
        }

        function fetchKeywordStats(keywordId) {
            let countryId = $('#country_id').val();

            let params = {
                keyword_id: keywordId,
                country_id: countryId
            }

            if ($('#app option:selected').data('app-store') === 'google_play') {
                params.language_id = $('#languageId').val()
            }

            axios.get('https://iosinstalls.com/dashboard/stats', {
                params
            }).then((response) => {
                $('#keywordStatistics').removeClass('hidden');

                let lowestRank = 0;
                response.data.data.forEach(rank => {
                    if (rank + 5 > lowestRank) {
                        lowestRank = rank + 5;
                    }
                })

                let interval = 10
                if (lowestRank > 500) {
                    interval = 50
                } else if (lowestRank > 200) {
                    interval = 20
                }

                const config = {
                    type: 'line',
                    data: {
                        labels: response.data.dates,
                        datasets: [{
                            label: 'Ranking',
                            backgroundColor: "#FF5B51",
                            borderColor: "#FF5B51",
                            data: response.data.data,
                            fill: false,
                        }]
                    },
                    options: {
                        responsive: true,
                        tooltips: {
                            mode: 'index',
                            intersect: false,
                        },
                        hover: {
                            mode: 'nearest',
                            intersect: true
                        },
                        scales: {
                            xAxes: [{
                                display: true,
                                scaleLabel: {
                                    display: true,
                                    labelString: 'Date'
                                }
                            }],
                            yAxes: [{
                                display: true,
                                scaleLabel: {
                                    display: true,
                                    labelString: 'Rank'
                                },
                                ticks: {
                                    beginAtZero: true,
                                    stepSize: interval,
                                    min: 1,
                                    max: lowestRank,
                                    reverse: true
                                }
                            }]
                        }
                    }
                };

                if (window.myLine) {
                    window.myLine.destroy()
                }

                const ctx = document.getElementById('stats').getContext('2d');
                window.myLine = new Chart(ctx, config);
            });
        }

        function assignUpdateRankEvent() {
            $('.update-rank').click(function() {
                var icon = $(this);
                if (!icon.hasClass('fa-spin')) {
                    var textContainer = icon.parent().find('span');
                    icon.addClass('fa-spin');

                    let params = {
                        keyword_id: $(this).data('keyword-id'),
                        country_id: $('#country_id').val()
                    }

                    if ($('#app option:selected').data('app-store') === 'google_play') {
                        params.language_id = $('#languageId').val()
                    }

                    $.ajax({
                        url: 'https://iosinstalls.com/dashboard/update-keyword-rank',
                        type: 'POST',
                        data: params,
                        success: function(response) {
                            icon.removeClass('fa-spin');
                            if (response.success) {
                                textContainer.removeClass('text-danger');
                                textContainer.text(response.rank);
                            } else {
                                textContainer.addClass('text-danger');
                                textContainer.text(response.error);
                            }
                        },
                        error: function() {
                            icon.removeClass('fa-spin');
                            textContainer.addClass('text-danger');
                            textContainer.text('ERROR');
                        }
                    });
                }
            });
        }

        function assignStatisticsEvent() {
            $('.statictics').click(function() {
                fetchKeywordStats($(this).data('keyword-id'));
            })
        }

        function assignDeleteEvent() {
            $('.delete').click(function() {
                let obj = $(this);
                if (confirm("Are you sure you want to delete this keyword? Can't be undone.")) {
                    var errors = $('#keyword-errors');
                    $.ajax({
                        url: '/dashboard/delete-keyword.php',
                        type: 'POST',
                        data: {
                            keyword_id: $(this).data('keyword-id')
                        },
                        success: function(response) {
                            if (response.success) {
                                obj.parents('tr')[0].remove();
                                errors.removeClass('hidden').removeClass('alert-danger').addClass('alert-success');
                                errors.text("Keyword successfully deleted.");
                            } else {
                                errors.removeClass('hidden').removeClass('alert-success').addClass('alert-danger');
                                errors.text(response.errors[0]);
                            }
                        },
                        error: function() {
                            errors.removeClass('hidden').removeClass('alert-success').addClass('alert-danger');
                            errors.text('Something went wrong, please reload the page.');
                        }
                    });
                }
            });
        }

        $(function() {
            var submitLadda = Ladda.create(document.querySelector('.ladda-button'));
            $('#addKeywordModal input').tagsinput()

            $('#country_id').change(function() {
                fetchKeywords()
            });

            $('#app').change(() => {
                $('#openKeywordModal').removeAttr('disabled')

                let country = $('#country_id');
                let appStore = $('#app option:selected').data('app-store')

                country.children().addClass('hidden');
                country.children("[data-app-store='" + appStore +"']").removeClass('hidden');
                country.removeAttr('disabled');
                country.selectpicker('refresh');

                if (appStore === 'google_play') {
                    $('#languageForm').removeClass('hidden')
                } else {
                    $('#languageForm').addClass('hidden')
                }

                if (country.val()) {
                    fetchKeywords()
                }
            })

            $('#languageId').change(() => {
                fetchKeywords()
            })

            $('#addKeywordModal').on('hidden.bs.modal', function () {
                if ($('#country_id').val()) {
                    fetchKeywords()
                }
            });

            $.validator.setDefaults({
                submitHandler: function () {
                    let alert = $('#addKeywordModal .alert');
                    alert.addClass('hidden');
                    submitLadda.start();
                    $.ajax({
                        url: "/dashboard/add-keyword.php",
                        type: "POST",
                        data: {
                            "app_id": $('#app').val(),
                            "keyword": $('#keyword').val()
                        },
                        success: function (response) {
                            submitLadda.stop();

                            if (response.status) {
                                alert.removeClass('hidden')
                                $('#addKeywordModal input#keyword').tagsinput('removeAll')
                            } else {
                                $('#errors').removeClass('hidden');
                                $('#errors').text(response.errors[0]);
                            }
                        },
                        error: function() {
                            submitLadda.stop();
                        }
                    });
                }
            });

            $('#addKeywordForm').validate( {
                rules: {
                    "keyword": 'required'
                },
                messages: {
                    "keyword": 'Please enter the keyword you would like to add'
                },
                errorElement: 'div',
                errorPlacement: function ( error, element ) {
                    // Add the `help-block` class to the error element
                    error.addClass( 'form-control-feedback' );
                    error.insertAfter( $(element).parent() );
                },
                highlight: function ( element, errorClass, validClass ) {
                    $( element ).addClass( 'form-control-danger' ).removeClass( 'form-control-success' );
                    $( element ).parents( '.form-group' ).addClass( 'has-danger' ).removeClass( 'has-success' );
                },
                unhighlight: function (element, errorClass, validClass) {
                    $( element ).addClass( 'form-control-success' ).removeClass( 'form-control-danger' );
                    $( element ).parents( '.form-group' ).addClass( 'has-success' ).removeClass( 'has-danger' );
                }
            });
        });
    </script>

        
                        </body>
</html>